// 收费明细
<template>
  <div class="contractDetails">
      <div class="card-box">
          <div class="card-title">合同费用汇总</div>
          <el-form ref="form"
                   class="form-wrap"
                   size="small">
              <el-form-item label="合同总租金"
                            prop="contractPayableTotal">
                  <span>{{contractReceivableTotal}}</span>
              </el-form-item>
              <el-form-item label="月租金"
                            prop="rentAmount">
                  <span>{{rentAmount}}</span>
              </el-form-item>
              <el-form-item label="合同租期"
                            prop="startDate">
                  <span>{{startDate}}至{{endDate}}</span>
              </el-form-item>
          </el-form>
      </div>
    <div class="title">合同费用明细</div>
    <el-table :data="receivableFees" style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column prop="costMonth" :formatter="monthFommater" label="所属月份" width="180">
        <template slot-scope="scope">
          {{scope.row.costMonth|shortMonth}}
        </template>
      </el-table-column>
      <el-table-column prop="chargeProjectName" label="收费项目" width="180"/>
      <el-table-column prop="costPeriodStart" label="开始日期" width="180"/>
      <el-table-column prop="costPeriodEnd" label="结束日期" width="180"/>
      <el-table-column prop="receivableDate" label="应收日期" width="180"/>
       <el-table-column prop="receivableMoneyOld" label="合同应收金额" width="180" />
       <el-table-column prop="adjustmentAmount" label="调整金额"    width="180" />
      <el-table-column prop="receivableMoney" label="应收金额" width="180"/>
    </el-table>
  </div>
</template>

<script>
import { getGenerateFeeObj } from "../../api/rent-contract.js";
import {  fetchList} from '../../api/rent-contract-acceptance.js'
export default {
  name: "contractDetails",
  data() {
    return {
      //合同明细数据
      receivableFees: [],

      contractReceivableTotal: 0,
      rentAmount: 0,
      startDate: '',
      endDate: '',
      //选中的合同明细项目
      multipleSelection: [],
    };
  },

  mounted: function () {
    //this.preViewFee();
  },

  methods: {
    //加载费用信息
    preViewFee(contractId,contract) {
      //alert("费用预览");
      let rentContractId = contractId; //this.$route.query.id;

        let contractStatus = null
        if (contract) {
            contractStatus = contract.status
            this.rentAmount = contract.rentAmount
            this.startDate = contract.startDate
            this.endDate = contract.endDate
        }

        if (
            contractStatus == '13' ||
            contractStatus == '03' ||
            contractStatus == '04' ||
            contractStatus == '06'
        ) {
            fetchList({ rentContractId: rentContractId, category: 1, size: 200 }).then(
                (response) => {
                    if (response.data.code == 0) {
                        //if(response.data.data.length>0) {
                        this.receivableFees = response.data.data.records

                        //总租金求和
                        this.contractReceivableTotal = 0
                        for (let i = 0; i < this.receivableFees.length; i++) {
                            this.contractReceivableTotal += this.receivableFees[i].receivableMoneyOld
                        }
                        //alert(JSON.stringify(response.data.data))
                        //hasfees = true;
                        //}
                    } else {
                        this.$alert('加载应收款服务端服务错误' + response.code)
                    }
                }
            )
        } else {

            getGenerateFeeObj(rentContractId).then((response) => {
                //alert(response.data)
                if (response.data.code == 0) {
                    this.receivableFees = response.data.data;

                    this.contractReceivableTotal = 0
                    for (let i = 0; i < this.receivableFees.length; i++) {
                        this.contractReceivableTotal += this.receivableFees[i].receivableMoneyOld
                    }

                } else {
                    this.$alert("加载费用服务端服务错误" + response.code);
                }
            });
        }
    },

    monthFommater(row, column) {
      return row.costMonth.toString().substr(0, 7);
    },

    toggleSelection(rows) {
      if (rows) {
        rows.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.multipleTable.clearSelection();
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
  },
};
</script>

<style scoped lang="scss">
    @include formWrap();
</style>
<style lang="scss" scoped>
.contractDetails {
  .title {
    text-align: center;
    font-size: 20px;
    margin: 40px 0 30px;
  }
  /deep/ .el-table {
    .el-table__header {
      border-color: #dee2e6;
    }
    thead th {
      background-color: #FAFAFA;
      color: #333;
    }
    td {
      padding: 10px 0;
    }
  }
}
</style>
